<div class="nv-dialog screen-area">
  <div class="d-flex justify-content-between align-items-center">
    <h4 mat-dialog-title class="mb-2">
      {{'admissionControl.MATCHING_TEST' | translate}}
    </h4>
    <button (click)="onCancel()" class="mb-2" aria-label="Close dialog" mat-icon-button>
      <i class="eos-icons ">close</i>
    </button>
  </div>
  <hr class="fancy mb-2" />
  <app-import-test-file
    [importUrl]="importUrl"
    [alias]="'matchingTest'"
    (getImportResult)="getImportResult($event)"
  >
  </app-import-test-file>
  <div *ngIf="configAssessmentResult && configAssessmentResult.results.length > 0">
    <div><strong>{{ 'admissionControl.matchingTestGrid.TITLE' | translate}}</strong></div>
    <div
      (click)="exportCsv()"
      class="pull-right"
    >
      <em
        class="eos-icons icon-18 hand margin-right-s"
      >csv_file</em>
    </div>
    <div
      (click)="exportPdf()"
      class="pull-right mr-2"
    >
      <em
        class="eos-icons icon-18 hand margin-right-s"
      >print</em>
    </div>
    <div class="text-muted margin-top-s"><strong>{{ 'admissionControl.matchingTestGrid.UNAVAILABLE_PROP' | translate}}:&nbsp;</strong>{{configAssessmentResult.props_unavailable.join(", ")}}</div>
    <ag-grid-angular
      #agGrid
      id="configuration-assessment-result-grid"
      style="width: 100%; height: 300px;"
      class="ag-theme-balham"
      [enableCellTextSelection]="true"
      [ensureDomOrder]="true"
      [gridOptions]="gridOptions"
      [rowData]="configAssessmentResult.results"
      >
    </ag-grid-angular>
  </div>

</div>
